<template>
  <div class="box-border w-full h-full">
    <div class="w-full h-[80px]">
      <Header />
    </div>
    <div class="w-full h-[calc(100%-80px)] main_bg">
      <el-config-provider :locale="zhCn">
        <router-view v-slot="{ Component, route }">
          <Transition name="fade-transform" mode="out-in">
            <component :is="Component" :key="route.path" />
          </Transition>
        </router-view>
      </el-config-provider>
    </div>
  </div>
</template>

<script setup>
import zhCn from 'element-plus/es/locale/lang/zh-cn'
import Header from '@/header/index.vue'
</script>

<style scoped>
.main_bg {
  background-image: url(./assets/images/main_bg.webp);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
</style>
